<template>
	<view>
		<view id="__nc" style="margin-left:auto;margin-right:auto;"><view id="nc"></view></view>
	</view>
</template>

<script>
export default {
	data() {
		return {};
	},
	mounted() {
		var nc_token = ['FFFF0N0N000000008EE7', new Date().getTime(), Math.random()].join(':');
		var nc = NoCaptcha.init({
			renderTo: '#nc',
			appkey: 'FFFF0N0N000000008EE7',
			scene: 'nc_login_h5',
			token: nc_token,
			trans: { key1: 'code200' },
			elementID: ['usernameID'],
			is_Opt: 0,
			language: 'cn',
			timeout: 10000,
			retryTimes: 5,
			errorTimes: 5,
			inline: false,
			apimap: {
				// 'analyze': '//a.com/nocaptcha/analyze.jsonp',
				// 'uab_Url': '//aeu.alicdn.com/js/uac/909.js',
			},
			bannerHidden: false,
			initHidden: false,
			callback: data => {
				window.console && console.log(nc_token);
				window.console && console.log(data.csessionid);
				window.console && console.log(data.sig);
				let params = {
					nc_token,
					csessionid: data.csessionid,
					sig: data.sig
				};
				this.$emit('send', params);
			},
			error: function(s) {}
		});
		NoCaptcha.setEnabled(true);
		nc.reset(); //请务必确保这里调用一次reset()方法

		NoCaptcha.upLang('cn', {
			LOADING: '加载中...', //加载
			SLIDER_LABEL: '请向右滑动验证', //等待滑动
			CHECK_Y: '验证通过，验证码已发送', //通过
			ERROR_TITLE: '非常抱歉，这出错了...', //拦截
			CHECK_N: '验证未通过', //准备唤醒二次验证
			OVERLAY_INFORM: '经检测你当前操作环境存在风险，请重新验证', //二次验证
			TIPS_TITLE: '验证错误，请重新验证' //验证码输错时的提示
		});
	}
};
</script>

<style lang="scss">
._nc .stage1 .slider {
	height: 52px !important;
	border-radius: 10px !important;
	box-shadow: 0 0 3px #999 !important;
	background-color: #2b9f93 !important;
	color: #ffffff !important;
	left: 0;
	right: 0;
}

._nc .stage1 .label {
	-webkit-text-fill-color: aliceblue;
	background: none;
}

._nc .stage1 .slider .button {
	background: #abd7d6 !important;
	border-radius: 10px !important;
}

._nc .stage1 .track div {
	border-radius: 10px !important;
	color: #fff !important;
}

._nc .stage1 .bg-green {
	background-color: #aad7d6 !important;
}

._nc .stage1 .bg-red {
	background-color: #78c430 !important;
}

._nc .stage {
	padding: 0;
}
._nc .icon-slide-arrow:before {
	/*  content: "\e607"; */
	color: #ffffff;
}
</style>
